import React from 'react';
import {connect} from 'dva'
import {Row, Col, Form, Select, message} from 'antd';
const R = require('ramda');
const FormItem = Form.Item;

export default connect(({lesseeAccount}) => ({lesseeAccount}))(Form.create({wrappedComponentRef: true})(class AccountInfos extends React.Component {
        constructor(props) {
            super(props);
        }

        handleResetFields = () => {
            this.props.form.resetFields();
        }

        setAccno = (value) => {
            let accountList = this.props.lesseeAccount.list ? this.props.lesseeAccount.list : [];
            let accopenbank = "";
            R.map((row) => {
                if(row.bankCode === value){
                    accopenbank = row.bankName;
                }
            }, accountList);

            this.props.setAccno(value, accopenbank);
        }

        handleConfirm = () => {
            let flag = false;
            this.props.form.validateFields((errors, values) => {
                if (errors) return;

                flag = true;
            })
            return flag;
        }

        render() {
            const {getFieldDecorator} = this.props.form;
            const formItemLayout = {labelCol: {xs: {span: 8}, sm: {span: 5}}, wrapperCol: {xs: {span: 15}, sm: {span: 14}}};

            let ptList = [{id: 999999999, name: "平台"}];
            let accountList = this.props.lesseeAccount.list ? this.props.lesseeAccount.list : [];

            return (
                <Form>

                            <FormItem {...formItemLayout} label="结算对象" hasFeedback>
                                {getFieldDecorator('stObjId', {
                                    rules: [{
                                        required: true, message: '请选择结算对象'
                                    }],
                                    initialValue: ''
                                })(
                                    <Select style={{width: '100%'}} disabled={this.props.disabled}
                                            showSearch allowClear
                                            placeholder="可通过输入关键字搜索"
                                            filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}>
                                        {
                                            !R.isNil(ptList) ? ptList.map(item => {
                                                return (<Select.Option value={item.id + ""}
                                                                       key={item.id + ""}>{item.name}</Select.Option>);
                                            }) : ''
                                        }
                                    </Select>
                                )}
                            </FormItem>

                            <FormItem
                                {...formItemLayout}
                                label="收款账号"
                                hasFeedback
                            >
                                {getFieldDecorator('accno',{
                                    rules: [{
                                        required: true, message: '请输入收款账号',
                                    }],
                                    initialValue: ""
                                })(
                                    <Select style={{width: '100%'}} disabled={this.props.disabled} onChange={this.setAccno.bind(this)}
                                            showSearch allowClear
                                            placeholder="可通过输入关键字搜索"
                                            filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}>
                                        {
                                            !R.isNil(accountList) ? accountList.map(item => {
                                                return (<Select.Option value={item.bankCode}
                                                                       key={item.id}>{item.bankCode}</Select.Option>);
                                            }) : ''
                                        }
                                    </Select>
                                )}
                            </FormItem>
                </Form>
            );
        }
    })
)

// WEBPACK FOOTER //
// ./public/src/components/order/components/AccountInfos.js